<template>
  <el-main class="main-content" style="padding: 20px">
    <!-- 根据激活状态显示对应内容 -->
    <div v-show="activeContent === '1'"><Introduce /></div>
    <div v-show="activeContent === '2'"><PersonalBillView /></div>
    <div v-show="activeContent === '3'"><PersonalInfoView /></div>
  </el-main>
</template>

<script setup>
  import Introduce from '@/components/Introduce.vue'
  import { defineProps } from 'vue'
  import PersonalInfoView from '@/views/PersonalInfoView.vue'
  import PersonalBillView from '@/views/PersonalBillView.vue'

  // 接收来自父组件的激活状态
  defineProps({
    // 当前激活内容的标识符（1/2/3）
    activeContent: {
      type: String,
      default: '1',
    },
  })
</script>
